<template>
  <div class='container'>

    <t-layout class="layout">
      <t-header>
        <t-head-menu theme="light">
          <template #logo>
            <t-icon name="palette-1" size="32" />
            <h3>西蒙来了</h3>
          </template>
          <t-menu-item value="item1" to="/">首页 </t-menu-item>
          <t-menu-item value="item2" to="/about"> 关于我们 </t-menu-item>
          <t-menu-item value="item4" :disabled="true"> 待发布 </t-menu-item>
          <template #operations>
            <t-button variant="text" shape="square">
              <template #icon><t-icon name="search" /></template>
            </t-button>
            <t-button variant="text" shape="square">
              <template #icon><t-icon name="mail" /></template>
            </t-button>
            <t-button variant="text" shape="square">
              <template #icon><t-icon name="user" /></template>
            </t-button>
            <t-button variant="text" shape="square">
              <template #icon><t-icon name="ellipsis" /></template>
            </t-button>
          </template>
        </t-head-menu></t-header>
      <t-content class="content">
        <RouterView class="router-view" />
      </t-content>
      <t-footer class="footer">Copyright @ 2005-{{ new Date().getFullYear() }} Simon. All Rights Reserved</t-footer>
    </t-layout>
  </div>
</template>
<script setup lang='ts'>
import { ref } from 'vue';
</script>
<style lang='scss' scoped>
.container {

  border-radius: 5px;

}



.content {
  margin: 0 50px;


}

.footer {
  text-align: center;
  padding: 10px 0;
}
</style>